import { Form, Input, Button, Table, Popconfirm, message, Space, Select, Pagination } from 'antd'
import './Tim.scss'
import { useEffect, useState } from 'react';
import http from '../../utils/http'
import store from '../../store/index'

const RoleTable = ({ setState }) => {
    const [data, setData] = useState([])
    const [myid, setMyid] = useState()
    var provide = { size: 10, current: 1 }
    const [total, setTotal] = useState(1)
    const [selectedRowKeys, setSelectedRowKeys] = useState([])
    const [current, setCurrent] = useState(1)
    console.log(provide)
    useEffect(() => {
        getdata('')
    }, [])
    const getdata = (v) => {
        http({
            url: '/peree_Comments/findPeree_Comments',
            params:{perName:v}
        }).then((res) => {
            setData(res.data.listPeree)
            console.log(res);
            if (res.code == 200) {
                // 对数据进行处理
                let arr = res.data.listPeree.map((v, i) => {
                    return {
                        perId: v.perId,
                        key: v.perId,
                        person_name: v.personName,
                        contract_create_time: getLocalTime(v.contractCreate_time),
                        perPhone: v.perPhone,
                        per_Name: v.perName,
                        per_SocialCode: v.perSocialCode,
                        room_no: v.roomNo,
                        ten_Serialint: v.tenSerialint
                    }
                })
                setData(arr);
                setTotal(res.data.countRows)
                console.log(total)
                // sessionStorage.setItem('table', JSON.stringify(arr));
            }
        })
    }
    // 时间戳转换函数
    function getLocalTime(nS) {
        let date = new Date(nS);
        //时间戳为10位需*1000，时间戳为13位的话不需乘1000
        let y = date.getFullYear();
        let MM = date.getMonth() + 1;
        MM = MM < 10 ? "0" + MM : MM; //月补0
        let d = date.getDate();
        d = d < 10 ? "0" + d : d; //天补0
        // let h = date.getHours();
        // h = h < 10 ? "0" + h : h; //小时补0
        // let m = date.getMinutes();
        // m = m < 10 ? "0" + m : m; //分钟补0
        // let s = date.getSeconds();
        // s = s < 10 ? "0" + s : s; //秒补0
        // return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
        return y + "-" + MM + "-" + d;
    }
    const [form] = Form.useForm();
    const CdDetail = (a, b) => {
        console.log(a, b)
        store.zengjiayu.setTimdetailid(b)
        setState(3)
    }
    const add = () => {
        setState(2)
    }
    //查询
    const search = () => {
        form.getFieldsValue(true).size = 10
        form.getFieldsValue(true).current = current
        // console.log(form.getFieldsValue(true))
        provide = form.getFieldsValue(true).perName
        console.log(provide)
        getdata(provide)
    }
    //重置
    const resize = () => {
        provide = { size: 10, current: 1 }
        setSelectedRowKeys([])
        form.setFieldsValue({
            contractCreate_time: '',
            perId: '',
            perName: "",
            perPhone: "",
            perSocialCode: "",
            personName: "",
            roomNo: '',
            tenSerialint: "",
        })
        getdata()
    }
    const openEditBox = () => {

    }
    const fenyeqi = (a, b) => {
        setCurrent(a)
        console.log(a)
        provide = { size: 10, current: a }
        getdata()
    }
    function cancel(e) {
    }
    function confirm(a, b) {
        var id = []
        if (b) {
            id.push(b.key)
        } else {
            id = selectedRowKeys
            setSelectedRowKeys([])
        }
        console.log(id)
        http({
            url: '/peree_Comments/DeletePeree',
            data: id,
            method: 'post',
        }).then((res) => {
            console.log(res)
            if (res.code == 200) {
                provide = { size: 10, current: current }
                getdata()
                message.success('删除成功！');
            }
            else {
                message.error('删除失败！')
            }
        })
    }
    const columns = [
        {
            title: '租户名称',
            dataIndex: 'per_Name',
            render: (text) => <a>{text}</a>,
        },
        {
            title: '所属楼宇',
            dataIndex: 'ten_Serialint',
        },
        {
            title: '房间名称',
            dataIndex: 'room_no',
        },
        {
            title: '社会信用代码',
            dataIndex: 'per_SocialCode',
        },
        {
            title: '负责人姓名',
            dataIndex: 'person_name',
        },
        {
            title: '联系方式',
            dataIndex: 'perPhone',
        },
        {
            title: '注册时间',
            dataIndex: 'contract_create_time',
        },
        {
            title: '操作',
            dataIndex: 'operation',
            render: (text, record) => (
                <Space size="middle">
                    {/* () => { openEditBox(text, record) } */}
                    <a onClick={() => { CdDetail(text, record) }}>详情</a>
                    <Popconfirm
                        title="确定要删除吗?"
                        onConfirm={() => { confirm(text, record) }}
                        onCancel={cancel}
                        okText="Yes"
                        cancelText="No"
                    >
                        <a href="#">删除</a>
                    </Popconfirm>
                </Space>
            ),
        },
    ];
    let newSelectData = []
    const rowSelection = {
        selectedRowKeys,
        onChange: (selectedRowKeys, selectedRows) => {
            setSelectedRowKeys(selectedRowKeys)
            console.log(`selectedRowKeys: ${selectedRowKeys}`, 'selectedRows: ', selectedRows);
            newSelectData = [...selectedRows]
        },
        getCheckboxProps: (record) => ({
            // disabled: record.name === 'Disabled User',
            // Column configuration not to be checked
            name: record.name,
        }),
    };

    return <div className='roleContent'>
        <Form form={form} name="horizontal_login" layout="inline" className='title'>
            <Form.Item
                name="username">
                <div className='kuai'>
                    <span></span>
                    <span>租户信息管理</span>
                </div>
            </Form.Item>
            <Form.Item className='btn'>
                <div>
                    <Button className='cha'
                        type="primary"
                        onClick={add}>新增</Button>
                    <Popconfirm title="确定要将他们全部删除吗？"
                        onConfirm={() => { confirm() }}
                        onCancel={cancel} okText="Yes" cancelText="No">
                        <a href="#"><Button className='resize' type="primary">批量删除</Button></a>
                    </Popconfirm>
                </div>

            </Form.Item>
        </Form>
        <div className='biao'>
            <Form form={form} name="horizontal_login" layout="inline" className='Role tim'>
                <div>
                    <Form.Item
                        name="perName"
                        label='租户名称'
                    ><Input placeholder='请输入租户名称' />
                    </Form.Item>
                    <Form.Item
                        name="tenSerialint"
                        label="所属楼宇"
                    >
                        <Select>
                            <Select.Option value="A1">
                                A1
                            </Select.Option>
                            <Select.Option value="B2">
                                B2
                            </Select.Option>
                            <Select.Option value="C3">
                                C3
                            </Select.Option>
                        </Select>
                    </Form.Item>
                    <Form.Item
                        name="roomNo"
                        label='房间名称'
                    ><Input placeholder='请输入房间名称' />
                    </Form.Item>

                    <Form.Item className='btn'>
                        <div>
                            <Button className='cha'
                                type="primary"
                                onClick={search}>查询</Button>
                            <Button className='resize' onClick={resize} type="primary">重置</Button>
                        </div>

                    </Form.Item>
                </div>
                <div>
                    <Form.Item
                        name="perSocialCode"
                        label='社会信用代码'
                    ><Input placeholder='请输入统一社会信用代码' />
                    </Form.Item>
                    <Form.Item
                        name="personName"
                        label='负责人姓名'
                    ><Input placeholder='请输入负责人姓名' />
                    </Form.Item>
                    <Form.Item
                        name="perPhone"
                        label='联系方式'
                    ><Input placeholder='请输入联系方式' />
                    </Form.Item>
                    <div></div>
                </div>
            </Form>
            <Table className='table1'
                rowSelection={{
                    ...rowSelection,
                }}
                columns={columns}
                dataSource={data}
                pagination={false}
            />
            <Pagination className='fenyeqi' onChange={fenyeqi} total={total} />
        </div>
    </div>
};
export default RoleTable